<template>
    <Row class="search border">
      <Col span="22" class="search_input">
        <div v-if="showzjType" class="inputBox zjType">
           <label>资金类型</label>
           <Select v-model="zjType" label="资产" style="width:200px" @on-change="getZjlm()">
            <!-- <Option v-for="item in zjlxList" :value="item.value" :key="item.value" :label="item.label"></Option> -->
             <Option value="01">资产</Option>
             <Option value="02">负债</Option>
             <Option value="03">净资产</Option>
           </Select>
        </div>
        <div v-if="showzjColumn" class="inputBox zjColumn">
          <label>资金栏目</label>
          <Select v-model="zjColumn" label="全部" style="width:200px">
            <Option value="">全部</Option>
            <Option v-for="item in zjlmList" :value="item.BH" :key="item.MC" :label="item.MC"></Option>
          </Select>
        </div>
        <div v-if="showprovice" class="inputBox provice">
          <label>省份</label>
          <Select v-model="provice" label='全国' style="width:200px" @on-change="getZx()">
            <Option value="">全国</Option>
            <Option v-for="item in sfList" :value="item.SHENGBH" :key="item.SHENGMC" :label="item.SHENGMC"></Option>
          </Select>
        </div>
        <div v-if="showcenter" class="inputBox center">
          <label>中心</label>
          <Select v-model="center" label='全省(市)' style="width:200px">
            <Option value="">全省(市)</Option>
            <Option v-for="item in zxList" :value="item.SHIBH" :key="item.SHIBHMC" :label="item.SHIBHMC"></Option>
          </Select>
        </div>
        <div v-if="showqxType" class="inputBox qxType">
          <label>期限类型</label>
          <Select v-model="qxType" label='全部' style="width:200px" @on-change="getDqqx()">
            <Option value="0">全部</Option>
            <Option value="1">活期</Option>
            <Option value="2">定期</Option>
          </Select>
        </div>
        <div v-if="showdqqx" class="inputBox dqqx">
           <label>定期期数</label>
           <Select v-model="dqqx" label='全部' style="width:200px">
            <Option value="">全部</Option>
            <Option v-for="item in dqqxList" :value="item.BH" :key="item.MC" :label="item.MC"></Option>
           </Select>
        </div>
        <div v-if="showjcbh" class="inputBox">
            <label>检查项</label>
            <Select v-model="jcbh" clearable label="全部" style="width:200px">
            <Option v-for="item in checkList" :value="item.JCBH" :key="item.JCBH" :label="item.JCMC"></Option>
            </Select>
        </div>
        <div v-if="showywlx" class="inputBox">
            <label>业务类型</label>
            <Select v-model="ywlx" clearable label="全部" style="width:200px">
            <Option v-for="item in ywlxList" :value="item.value" :key="item.value" :label="item.label"></Option>
            </Select>
        </div>
        <div v-if="showmonth" class="inputBox month">
          <label>期数</label>
          <DatePicker format="yyyy-MM" :key="visitDate" type="month" :value="visitDate" style="width: 200px" @on-change="visitDate=$event"></DatePicker>
        </div>
      </Col>
      <Col span="2" style="text-align:right"><Button type="primary" icon="ios-search" @click="init()">查询</Button></Col>
    </Row>
</template>
<style lang="scss" scoped>
// .fundS{
//     .zjType,.zjColumn,.month{
//         display: block;
//     }
// }
// .capitalT{
//     .zjType,.zjColumn,.provice,.center{
//         display: block;
//     }
// }
// .capitalDistri{
//     .zjType,.provice,.center,.month{
//         display: block;
//     }
// }
// .conditionStock{
//     .qxType,.dqqx,.month{
//         display: block;
//     }
// }
// .depositTrend{
//     .provice,.center,.qxType,.dqqx{
//         display: block;
//     }
// }
// .fundSI{
//     .provice,.center,.month{
//         display: block;
//     }
// }
</style>
<script>
import { initSearch } from "../../../static/js/tool";
export default {
    data(){
        return{
            zjlmList: [], //资金栏目  
            sfList: [], //省份
            zxList: [], //中心
            dqqxList: [], //定期期数
            checkList: [],//检查项
            ywlxList: [],//业务类型
            zjColumn: "",//选中的资金栏目
            provice: "",//选中的省份
            center: "",//选中的中心
            zjType: "",//资金类型
            dqqx: "",
            cyear: "",
            cmonth: "",
            qxType: "",
            jcbh: "",
            ywlx: "",
            visitDate:"",
            showzjType:false,
            showzjColumn:false,
            showprovice:false,
            showcenter:false,
            showqxType:false,
            showdqqx:false,
            showmonth:false,
            showjcbh:false,
            showywlx:false,
        }  
    },
    mounted(){
        initSearch(this);
        let nowDate = new Date();
        let year = nowDate.getFullYear();
        let month = nowDate.getMonth()+1 < 10 ? "0"+(nowDate.getMonth()) : nowDate.getMonth();
        this.cyear = year;
        this.cmonth = month;
        this.zjType = '01';
        this.qxType = '0';
        this.visitDate = year+'-' + month;
        console.log(nowDate,this.visitDate,nowDate.getMonth(),month)
        if (this.showprovice) {
            this.getSf();
        }
        if (this.showzjColumn) {
            this.getZjlm();
        }
        if (this.showjcbh) {
            this.getCheckItem();
        }
        if (this.showywlx) {
            this.getBusinessType();
        }
        this.init({
            kmsx: this.zjType,
            kmbh: this.zjColumn,
            cyear: this.cyear,
            cmonth: this.cmonth,
            provice : this.provice,
            center : this.center,
            dqqx: this.dqqx,
            qxType: this.qxType,
            jcbh: this.jcbh,
            ywlx: this.ywlx,
            date:this.visitDate,
            })
        },
    methods:{
        init(data){
            let sdata = {
                kmsx: this.zjType,
                kmbh: this.zjColumn,
                cyear: this.cyear,
                cmonth: this.cmonth,
                provice : this.provice,
                center : this.center,
                dqqx: this.dqqx,
                qxType: this.qxType,
                jcbh: this.jcbh,
                ywlx: this.ywlx,
                date:this.visitDate,
            }
            this.$emit('search',sdata)
        },
        // getYear(a) {
        //     var time = a;
        //     this.cyear = time.substr(0, 4);
        //     this.cmonth = time.substr(5, 2);
        // },
        getZjlm() {
        //获取资金栏目
            this.zjColumn = '';
            this.$http.post("/api/fundUtil/getFundColumn", { type: this.zjType })
            .then(res => {
                this.zjlmList = res.retBody;
            });
        },
        getSf() {
        //获取省份
            this.$http.post("/api/fundUtil/getProvince")
            .then(res => {
                this.sfList = res.retBody;
            });
        },
        getZx() {
        //获取省份下对应中心
            this.$http.post("/api/fundUtil/getCenter", { bh: this.provice })
            .then(res => {
                this.zxList = res.retBody;
            });
        },
        getDqqx() {
            //select选择框的内容获取
            this.dqqx = '';
            this.dqqxList = '';
            if(this.qxType == '2'){
                this.$http.post("/api/fundUtil/getTermPeriod",)
                .then(res => {
                this.dqqxList = res.retBody;
                });
            }
        },
        //检查项
        getCheckItem(){
            this.$http.post("/api/fundUtil/getCheckItem", { params: {} }).then(res => {
            this.checkList = res.retBody;
            });
        },
        //业务类型
        getBusinessType(){
            this.$http.post("/api/fundUtil/getBusinessType", { params: {} }).then(res => {
            this.ywlxList = res.retBody;
            });
        },
    }
}
</script>

